<template>
  <van-nav-bar
    title="注册"
    left-text="返回"
    left-arrow
    @click-left="onClickLeft"
  />
  <van-empty description="请设置登录密码" />

  <van-form @submit="onSubmit">
    <van-field
      v-model="password"
      :type="type"
      name="password"
      label="密码"
      placeholder="请根据提示输入密码"
      :rules="rules"
      :right-icon="rightIcon"
      @click-right-icon="watchEye"
    />
    <van-button round block type="primary" native-type="submit">
      注册
    </van-button>
  </van-form>
  <p style="margin: 10px auto; font-size: 14px; width: 90%">
    Tip: 密码强度校验:最少5位,包括至少1个字母,1个数字
  </p>
</template>

<script>
import { setPasswordApi } from "@/api/my.js";
import { showToast } from "vant";
export default {
  name: "SetPass",
  data() {
    return {
      tel: sessionStorage.getItem("tel"),
      password: "",
      type: "password",
      rightIcon: "closed-eye",
      rules: [
        {
          required: true,
          message: "请填写密码",
        },
        {
          pattern: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{5,}$/,
          message: "密码强度校验:最少5位,包括至少1个字母,1个数字",
        },
      ],
    };
  },
  created() {
    console.log(this.tel);
  },
  methods: {
    // 密码显示与隐藏
    watchEye() {
      if (this.rightIcon === "closed-eye") {
        (this.type = "text"), (this.rightIcon = "eye-o");
      } else {
        (this.type = "password"), (this.rightIcon = "closed-eye");
      }
    },
    async onSubmit() {
      let res = await setPasswordApi({
        tel: this.tel,
        password: this.password,
      });
      if (res.data.code === "200") {
        this.$router.push("/Login");
        showToast("注册成功！");
      } else {
        showToast("注册失败！");
      }
    },

    // async onClickGo() {
    //   let res = await this.$http({
    //     url: "user/dofinishregister",
    //     method: "post",
    //     data: {
    //       tel: this.tel,
    //       password: this.password,
    //     },
    //   });
    //   if (res.data.code === "200") {
    //     if (this.regExp.test(this.password)) {
    //       this.$router.push("/Login");
    //       // console.log(res.data);
    //     }
    //   }
    // },
    onClickLeft() {
      this.$router.back(-1);
    },
  },
};
</script>

<style></style>
